<template>
	<ve-dialog
		:on-close="cancel"
		:show.sync="show"
		title="自定义列表"
		width="400px"
	>
		<el-checkbox-group
			v-model="checkedDefine"
		>
			<template v-for="prop in propList">
				<el-checkbox v-if="!hiddenProp(prop)" :key="prop.id" :label="prop">{{ prop.fieldDescription }}</el-checkbox>
			</template>
		</el-checkbox-group>
		<template #footer>
			<el-button @click="cancel">取 消</el-button>
			<el-button type="primary" :loading="isLoading" @click="save">确 定</el-button>
		</template>
	</ve-dialog>
</template>

<script>
import questionApi  from "@rc/apis/rc/question.mjs";
export default {
    name: 'prop-dialog',
    props:{
        show:{
            type:Boolean,
            default:false
        },
        checkedList:{// 用户显示的字段数组
            type:Array,
            default:()=>[]
        },
        propList:{// 所有可
            type:Array,
            default:()=>[]
        },
        listType: { //全部试题all 待审核audit 审核失败fail
            type:String,
            default:''
        }
    },
    data() {
        return {
            isLoading: false,
            checkedDefine:[]
        };
    },
    watch:{
        checkedList:{
            deep:true,
            immediate:true,
            handler(val) {
                this.checkedDefine =[...val];
            }
        }
    },
    methods: {
        //隐藏自定义属性展示
        hiddenProp(prop){
            //待审核页面 -审核时间和审核人不展示
            if(this.listType==='audit' && ['checkUserName','checkTime'].includes(prop.field)){
                return true;
            }

            return false;
        },
        //确定保存
        save() {
            this.isLoading = true;
            const  customIds= this.checkedDefine.map(prop=>prop.id);
            questionApi.updateCustomShow({
				data: {
                    customIds:customIds.length?customIds:['0000']//全不勾选传['0000']与后台约定
				},
				success: (data) => {
                    if(data){
                        this.$message.success("修改成功");
					    this.$emit('success');
                    }else{
                        this.$message.success("修改失败");
                    }

				},
				complete: () => {
					this.isLoading = false;
				}
			});
        },
        //取消
        cancel(){
            this.$emit('cancel');
            this.checkedDefine = [];
        }
    }
};
</script>
<style lang="less" scoped>
   /deep/ .el-checkbox{
        width:145px;
        height: 30px;
        .el-checkbox__label{
            font-size: 14px;
        }
    }
</style>
